<html>
  <head>
    <title>用户列表</title>
    <meta charset="UTF-8">
     <style>
       *{
         margin: 0;
         padding: 0;
       }
       body{
        font-family: "微软雅黑";
       }
      .logo{
        padding-bottom: 20px;
        border-bottom: 1px solid #f4f4f4;
      }
      .left {
        height: 100%;
        border-right:1px solid #cccccc;
        width:192px;
        float: left;
        text-align: center;
        padding-top: 20px;
      }

      .lul li {
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 16px;
        
      }
      
      .lul li:hover {
        background-color: #eef1f6;
      }

      .left li a{
        text-decoration: none;
        color: #48576a;
      }
        /*右侧样式*/
       .right {
         width: 85%;
         float: left;
       }
      /*header*/
       .header{
         width: 100%;

         background-color: #4f5d80;
         color: white;
       }
      .hul li {

        height:50px;
        line-height: 50px;
        text-align: center;
        display: inline-block;
      }


      /*面包屑样式*/
      .mbx {
        background-color: white;
        padding-left: 10px;
        padding-top: 20px;
      }
      .mbx a {
        text-decoration: none;
      }



      .list {
        width: 100%;
        padding-left: 1%;
        padding-top:1% ;
      }

      /*表格*/
       table {
         width: 98%;
         text-align: center;
         border: 1px solid #aaaaaa;
       }

      table th {
        border: 1px solid #cccccc;
        height: 30px;
        line-height: 30px;
        /*background-color: antiquewhite;*/
        color: #4f5d80;
      }
       table td {
         border: 1px solid #cccccc;
         color: #676a6c;
         height: 25px;
         line-height: 25px;
       }

       tbody tr:hover {
         background-color: antiquewhite;
       }

      /*添加按钮*/
       .add_btn {
         padding: 10px 10px;
         margin: 5px 0;
         cursor: pointer;
         background-color: cornflowerblue;
         color: #FFF;
         display: inline-block;
         text-decoration: none;
         font-size: 16px;
         border-radius: 3px;
       }
    </style>



  </head>
  <body >

        <div class="left">
          <div class="logo">
            <img src="../../images/logo.44fc79c.png" width="100px">
          </div>
           <ul class="lul">
               <li>
               <a href="../index.html">首页</a>
              
             </li>
             <li>
              <a href="user/list.html">用户管理</a>
             </li>
           </ul>
        </div>
        <div class="right">
             <div class="header">

               <ul class="hul">
                 <li style="width: 50%">您好，${userName}！
                   现在是2017年6月5日 星期五 14:50
                 </li>
                 <li style="text-align: right;width:45% ">
                   退出
                 </li>
               </ul>

             </div>

            <div class="main">
                <div class="mbx">
                  <a href="javascript:void(0)">首页</a>  >>  <a href="javascript:void(0)">用户管理</a>
                </div>

              <div class="list">

                 <div>
                   <a href="add.html" class="add_btn">添加用户</a>
                 </div>
                <table cellpadding="0" cellspacing="0">
                  <thead>
                  <tr>
                    <th style="width: 3%">序号</th>
                    <th style="width: 15%">工号</th>
                    <th style="width: 10%">姓名</th>
                    <th style="width: 10%">登陆账号</th>
                    <th style="width: 20%">身份证号</th>
                    <th style="width: 10%">性别</th>
                    <th style="width: 15%">角色</th>
                    <th style="width: 15%">操作</th>
                  </tr>
                  </thead>

                  <tbody>
                  
                   <tr>
                      <th>1</th>
                      <td>111</td>
                      <td>张三</td>
                      <td>zs</td>
                      <td>411411190010160072</td>
                      <td>男</td>
                      <td>员工</td>
                      <td>
                     
                        <a href="edit.html">编辑</a>
                        <a href="#">删除</a>
                      </td>
                    </tr>
                  <tr>
                      <th>1</th>
                      <td>111</td>
                      <td>张三</td>
                      <td>zs</td>
                      <td>411411190010160072</td>
                      <td>男</td>
                      <td>员工</td>
                      <td>
                     
                        <a href="edit.html">编辑</a>
                        <a href="#">删除</a>
                      </td>
                    </tr>
                    

                  </tbody>
                </table>
              </div>

            </div>
        </div>
  </body>
</html>